/*
 * @Author: your name
 * @Date: 2021-04-23 23:32:50
 * @LastEditTime: 2021-04-24 07:29:06
 * @LastEditors: your name
 * @Description: In User Settings Edit
 * @FilePath: \offer20k\项目代码\fantasticit\src\pages\Knowledgenotes\Pythonstartsreading\index.tsx
 */
import React, { useEffect, useState } from "react"
import styles from "./index.less"
import Footer from "../../../components/Footer"
import { observer } from "mobx-react-lite"
import useStore from "@/context/useStore"
import { PythonAll, PythonChild } from "@/util/knowledge"

const Pythonstartsreading: React.FC = () => {
    let { Knowledge } = useStore();
    useEffect(() => {
        Knowledge.getPythonData()
    }, [])
    let data = [];
    data.push(JSON.parse(JSON.stringify(Knowledge.PythonData)))
    console.log(data)

    // let CheckLeftData:PythonChild[] = [];
    let [CheckLeftData, setCheckLeftData] = useState<PythonChild>()
    const click_checkLeft = (item: PythonChild) => {
        //    CheckLeftData.push(item);
        setCheckLeftData(item)
    }
    return (
        <div className={styles.python_container}>
            <main>
                <div className={styles.containers}>
                    <div className={styles.leftBox}>
                        <span className={styles.antbreadcrumb}><span>知识笔记&nbsp;&nbsp;</span>/&nbsp;<span>python 学习笔记&nbsp;&nbsp;</span>/&nbsp;<span>1.1输入输出</span></span>
                        <div className={styles.title_child}>
                            <div>{CheckLeftData?.html}</div>
                        </div>
                    </div>
                    <div className={styles.rightBox}>
                        <div className={styles.nav}>
                            {
                                data.map((item: any, index: number) => {
                                    return <div className={styles.con} key={index}>
                                        <div className={styles.Title}>
                                            {item.title}
                                        </div>
                                        <ul className={styles.Search_title}>
                                            {
                                                item.children ? item.children.map((item: PythonChild, index: number) => {
                                                    return (
                                                        <li key={index} onClick={() => {
                                                            click_checkLeft(item);
                                                        }}>{item.title}</li>
                                                    )
                                                }) : null
                                            }
                                        </ul>
                                    </div>
                                })
                            }
                        </div>
                        <div></div>
                    </div>
                </div>
            </main>
            <Footer />
        </div>
    )
}
export default observer(Pythonstartsreading);